"use strict";
import { Component } from 'react';
// react声明组件的三种方法

// 1）普通声明方式
const Components1 = React.createClass({
    click: function(){},
    render: function() {
        return (
             <div onClick={ this.click }>Components1</div>
        )
    }
});
// 用法
<Components1 />

// 2）类声明方式
class Components2 extends Comment{
    constructor(props){
        super(props);
        this.click.bind(this);
    }
    click(){}
    render(){
        return (
            <div onClick = { this.click }>Components2</div>
        )
    }
}
// 用法
<Components2 />

// 3）无状态声明方式
const Components3 = ({pro = 'Components3'}) => (
    <div>{ pro }</div>
);
// 用法
<Components3 />

// 4）命名空间
const Components4 = {
    Button: React.createClass({
        click: function(){},
        render: function() {
            return (
                <div onClick={ this.click }>Components1</div>
            )
        }
    })
};
// 用法
<Components4.Button />


// 思考设计一个有tab切换的表格组件
